{include file="public/head"/}
<div class="container-fluid">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info" id="headeralert">
                <button type="button" class="close">×</button>
                <p></p>
            </div>
        </div>
    </div>
    <div class="ntDesktop">
        <div class="ntDesktop-head">我的反馈</div>
        <div class="row">
            <div class="col-md-12">
                <table class="table table-striped table-hover ntTable">
                    <thead>
                    <tr>
                        <th>#</th>
                        <th>模块</th>
                        <th>反馈</th>
                        <th>图片</th>
                        <th>链接</th>
                        <th>回复</th>
                        <th>时间</th>
                        <th>修复</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="item in list" :key="item.id">
                        <td>{{formatUnit(item.id,'ID')}}</td>
                        <td>{{item.menuname}}</td>
                        <td>{{item.content}}</td>
                        <td> <a :href="item.imgurl" :download="item.img" v-if="item.imgurl">图片</a></td>
                        <td><a :href="item.urlmenu" target="_blank">页面</a></td>
                        <td align="right">{{item.replys}}</td>
                        <td>{{item.create_date}}</td>
                        <td>{{item.repair_at>0?'O':'-'}}</td>
                        <td align="right">
                            <!-- 有回复的就无法删除 -->
                            <button @click="delfeedback(item.id)" v-if="item.isexit==2" class="btn btn-sm btn-default">
                                删除
                            </button>
                            <button @click="myfeeddetail(item.id)" class="btn btn-sm btn-primary" data-toggle="modal"
                                    data-target="#feedback_detailModal">详情
                            </button>
                        </td>
                    </tr>
                    <tr style="text-align: center;" v-if="list.length==0">
                        <td colspan="9" class="no_date">{:strtoupper(lang('no_data'))}</td>
                    </tr>
                    </tbody>
                </table>
                <nav aria-label="Page navigation" class="navbox" v-show="list.length!=0">
                    <ul class="pagination"></ul>
                </nav>
            </div>
        </div>
        <!--问题反馈恢复modal-->
        <div class="modal fade" id="feedback_detailModal" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog modal-lg" style="width:60vw">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">问题反馈</h4>
                    </div>
                    <div class="modal-body">
                        <div class="row clearfix">
                            <div class="col-md-12 column">
                                <div class="alert alert-dismissable alert-info">
                                    <button type="button" class="close">×</button>
                                    <p></p>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <div class="div-scroll" style="max-height:50vh">
                                    <table class="table table-hover">
                                        <tbody>
                                        <tr>
                                            <td>
                                                <div style="margin-left:-2rem">
                                                    <div class="col-md-6 text-primary">
                                                        {{formatUnit(feedback.id,'ID')}} / {{feedback.create_name}} /
                                                        {{feedback.create_date}}
                                                    </div>
                                                    <div class="col-md-6 text-right">
                                                        <!--编辑反馈的问题-->
                                                        <button @click="editreflexback(feedback.id,feedback.content,3)"
                                                                v-if="feedback.time-feedback.create_at<300 && feedback.create_id=={$Request.session.userid}"
                                                                class="btn btn-sm btn-primary">编辑
                                                        </button>
                                                        <!--对反馈的问题进行回复-->
                                                        <button @click="editreflexback(feedback.id,feedback.create_name,4)"
                                                                class="btn btn-sm btn-default">回复
                                                        </button>
                                                    </div>
                                                    <div class="col-md-12">
                                                        {{feedback.content}}
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr v-for="(item ,index) in feedbackdetail">
                                            <td>
                                                <div :style="'margin-left: '+item.level*2+'rem'">
                                                    <div class="col-md-6 text-primary">
                                                        {{formatUnit(item.id,'ID')}} / {{item.create_name}} /
                                                        {{item.create_date}}
                                                    </div>
                                                    <div class="col-md-6 text-right">
                                                        <button @click="editreflexback(item.id,item.content,1)"
                                                                v-if="item.time-item.create_at<300 && item.create_id=={$Request.session.userid}"
                                                                class="btn btn-sm btn-primary">编辑
                                                        </button>
                                                        <button @click="editreflexback(item.id,item.create_name,2)"
                                                                class="btn btn-sm btn-default">回复
                                                        </button>
                                                    </div>
                                                    <div class="col-md-12">
                                                        {{item.content}}
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-11">
                                <textarea :placeholder="reply" style="height: 7vh" class="form-control"
                                          v-model="content"></textarea>
                            </div>
                            <div class="col-md-1">
                                <button :disabled="isdisadble" class="btn btn-primary" @click="addreply">提交</button>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal"><span
                                class="glyphicon glyphicon-remove"></span>取消
                        </button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>
    </div>
</div>
{include file="public/foot"/}
<script>
    var table = new Vue({
        el: '.ntDesktop',
        data: {
            list: [],
            page: 1,
            pageSize: 30,
            feedbackdetail: [],//该问题反馈详情
            feedback: [],//反馈的问题
            content: '',
            id: '',//回复id
            feedback_id: '',//问题id
            isdisadble: false,
            mark: '',//提交标志
            reply: '',//@回复的人
        },
        methods: {
            formatUnit: formatUnit,
            setPage(pageCurrent, pageSum) {
                //数据总条数
                var myPageCount = pageSum;
                //一页显示多少条
                var myPageSize = this.pageSize;
                //总页数
                var countindex = myPageCount % myPageSize > 0 ? (myPageCount / myPageSize) + 1 : (myPageCount / myPageSize);
                $.jqPaginator('.pagination', {
                    totalPages: parseInt(countindex),
                    //最多显示多少页
                    visiblePages: 5,
                    //默认显示第几页
                    currentPage: pageCurrent,
                    first: '<li class="first"><a href="javascript:;">' + langcon.page_home + '</a></li>',
                    prev: '<li class="prev"><a href="javascript:;"><i class="arrow arrow2"></i>' + langcon.previous_page + '</a></li>',
                    next: '<li class="next"><a href="javascript:;">' + langcon.next_page + '<i class="arrow arrow3"></i></a></li>',
                    last: '<li class="last"><a href="javascript:;">' + langcon.last_page + '</a></li>',
                    page: '<li class="page"><a href="javascript:;">{{page}}</a></li>',
                    all: '<li class="page"><a href="javascript:;">' + myPageCount + ' / ' + this.page + 'PG , ' + this.pageSize + ' /PG</a></li>',
                    onPageChange: (num, type) => {
                        if (type == "change") {
                            this.page = num
                            this.getAllList()
                        }
                    }
                });
            },
            //数据所有获取
            getAllList(){
                $('.loding').show();
                $.ajax({
                    url: "/admin/Problem/feedback",
                    type: 'post',
                    data: {
                        page: this.page,//分页
                        pageSize: this.pageSize,//条数
                        admin_my: '',
                    },
                    dataType: "json",
                    success: (result) => {
                        this.list = result.getfeedbacks;
                        if (result.size)
                            this.setPage(parseInt(this.page), result.size)
                        $('.loding').hide();
                    }
                })
            },
            //删除反馈问题
            delfeedback(id){
                $.ajax({
                    url: '/admin/Problem/feedbackdel?id=' + id,
                    type: 'post',
                    dataType: 'json',
                    success: (res) => {
                        change_mes_type('#headeralert', res.status)
                        $('#headeralert').show()
                        $('#headeralert p').html('*' + res.msg + '<br>')
                        if (res.status == 1) {
                            //移除这个索引的值
                            if (!(this.list.length - 1)) {
                                if (this.page > 1) {
                                    this.page--
                                }
                            }
                            this.getAllList()
                        }
                    }
                });
            },
            //提交回复
            addreply(){
                this.isdisadble = true;
                $.ajax({
                    url: '/admin/Problem/myfeedback',
                    type: 'post',
                    data: {
                        content: this.content,//回复内容
                        id: this.id,//回复id
                        feedback_id: this.feedback_id,//问题id
                        mark: this.mark,
                        savemyfeedback: ''
                    },
                    dataType: 'json',
                    success: (res) => {
                        if (res.status != 1) {
                            change_mes_type('.modal-body .alert', res.status)
                            $('.modal-body .alert').show()
                            $('.modal-body .alert p').html('*' + res.msg + '<br>')
                        } else {
                            change_mes_type('#headeralert', res.status)
                            $('#headeralert').show()
                            $('#headeralert p').html('*' + res.msg + '<br>')
                            $('#feedback_detailModal').modal('hide');
                            this.getAllList();
                        }
                        this.isdisadble = false;
                    }
                });
            },
            //回复 编辑
            editreflexback(id, content, code){
                this.id = id;
                if (code == 1) {
                    //回复表编辑
                    this.content = content;
                    this.mark = 'edit';
                } else if (code == 3) {
                    //问题表编辑
                    this.content = content;
                    this.mark = 'editfeekback';
                } else if (code == 2) {
                    //回复表回复
                    this.content = '';
                    this.reply = '回复' + content;
                    this.mark = 'reply';
                } else if (code == 4) {
                    //问题表回复
                    this.content = '';
                    this.reply = '回复' + content;
                    this.mark = 'replyfeekback';
                }
            },
            //反馈详情查看
            myfeeddetail(id){
                $.ajax({
                    url: '/admin/Problem/myfeedback',
                    data: {
                        id: id,
                        getmyfeedback: '',
                    },
                    type: 'post',
                    dataType: 'json',
                    success: (res) => {
                        this.feedbackdetail = res.feedbackdetail;
                        this.feedback = res.feedback;
                    }
                });
                //问题id
                this.feedback_id = id;
                //清空内容，@回复者 回复id  提交标志
                this.content = this.reply = this.id = this.mark = '';
            }
        },
        mounted(){
            this.getAllList()
            $('#feedback_detailModal').on('hide.bs.modal', () => {
                //清空提示值
                $('.modal-body .alert').hide()
                $('.modal-body .alert p').html()
                if (localStorage.getItem("model")) {
                    this.getAllList();
                    localStorage.removeItem("model");
                }
            })
        }
    })
</script>